import streamlit as st

st.set_page_config(
    page_title="银行数据分析平台",
    page_icon="🏦",
    layout="wide",
    initial_sidebar_state="collapsed"
)

# 隐藏默认元素
hide_streamlit_style = """
    <style>
    #MainMenu {visibility: hidden;}
    footer {visibility: hidden;}
    .st-emotion-cache-4z1n4l.erv3yhi2 {display: none;}
    .st-emotion-cache-scp8yw.e3g0k5y6 {display: none;}

    /* 自定义样式 */
    .main-header {
        text-align: center;
        color: #1f77b4;
        margin-bottom: 40px;
        font-size: 3rem;
        font-weight: bold;
        padding: 20px 0;
        border-bottom: 3px solid #1f77b4;
    }

    .module-card {
        background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
        border-radius: 15px;
        padding: 30px;
        margin: 15px 0;
        border: 2px solid #dee2e6;
        transition: all 0.3s ease;
        height: 100%;
    }

    .module-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        border-color: #1f77b4;
    }

    .module-title {
        color: #1f77b4;
        font-size: 1.8rem;
        font-weight: bold;
        margin-bottom: 20px;
        text-align: center;
    }

    .feature-list {
        list-style: none;
        padding: 0;
        margin: 20px 0;
    }

    .feature-list li {
        padding: 8px 0;
        border-bottom: 1px solid #e9ecef;
        color: #495057;
    }

    .feature-list li:before {
        content: "✓ ";
        color: #28a745;
        font-weight: bold;
    }

    .enter-button {
        background: linear-gradient(135deg, #1f77b4 0%, #2c3e50 100%);
        color: white;
        border: none;
        padding: 12px 30px;
        border-radius: 25px;
        font-size: 1.1rem;
        font-weight: bold;
        transition: all 0.3s ease;
        margin-top: 20px;
    }

    .enter-button:hover {
        transform: scale(1.05);
        box-shadow: 0 5px 15px rgba(31, 119, 180, 0.4);
    }

    .stats-container {
        background: white;
        border-radius: 10px;
        padding: 20px;
        margin: 20px 0;
        border: 1px solid #dee2e6;
        text-align: center;
    }

    .stats-number {
        font-size: 2.5rem;
        font-weight: bold;
        color: #1f77b4;
        margin: 10px 0;
    }

    .stats-label {
        color: #6c757d;
        font-size: 0.9rem;
    }
    </style>
"""
st.markdown(hide_streamlit_style, unsafe_allow_html=True)

# 主标题
st.markdown('<div class="main-header">🏦 银行数据分析平台</div>', unsafe_allow_html=True)

# 平台介绍
st.markdown("""
<div style='text-align: center; color: #6c757d; margin-bottom: 40px; font-size: 1.2rem;'>
    专业的银行现金业务数据分析解决方案，提供全面的ATM和网点业务洞察
</div>
""", unsafe_allow_html=True)

# 统计信息（示例）
col1, col2, col3, col4 = st.columns(4)

with col1:
    st.markdown("""
    <div class="stats-container">
        <div class="stats-number">150+</div>
        <div class="stats-label">ATM设备</div>
    </div>
    """, unsafe_allow_html=True)

with col2:
    st.markdown("""
    <div class="stats-container">
        <div class="stats-number">80+</div>
        <div class="stats-label">营业网点</div>
    </div>
    """, unsafe_allow_html=True)

with col3:
    st.markdown("""
    <div class="stats-container">
        <div class="stats-number">¥2.5亿</div>
        <div class="stats-label">日均交易额</div>
    </div>
    """, unsafe_allow_html=True)

with col4:
    st.markdown("""
    <div class="stats-container">
        <div class="stats-number">99.8%</div>
        <div class="stats-label">系统可用性</div>
    </div>
    """, unsafe_allow_html=True)

# 分析模块选择
st.markdown("## 📊 选择分析模块")
st.markdown("---")

col1, col2 = st.columns(2)

with col1:
    st.markdown('<div class="module-card">', unsafe_allow_html=True)
    st.markdown('<div class="module-title">🏧 ATM数据分析</div>', unsafe_allow_html=True)

    st.markdown("""
    <ul class="feature-list">
        <li>ATM现金交易深度分析</li>
        <li>设备运行状态监控</li>
        <li>现金流向与利用率分析</li>
        <li>设备维护预警</li>
        <li>交易时间模式分析</li>
    </ul>
    """, unsafe_allow_html=True)

    if st.button("进入ATM分析系统", key="atm_btn", use_container_width=True):
        st.switch_page("pages/streamlited.py")
    st.markdown('</div>', unsafe_allow_html=True)

with col2:
    st.markdown('<div class="module-card">', unsafe_allow_html=True)
    st.markdown('<div class="module-title">🏦 网点现金分析</div>', unsafe_allow_html=True)

    st.markdown("""
    <ul class="feature-list">
        <li>柜面现金交易全景分析</li>
        <li>现金库存智能管理</li>
        <li>网点运营效率评估</li>
        <li>预约款业务分析</li>
        <li>现金流预测分析</li>
    </ul>
    """, unsafe_allow_html=True)

    if st.button("进入网点分析系统", key="branch_btn", use_container_width=True):
        st.switch_page("pages/branch_analysis.py")
    st.markdown('</div>', unsafe_allow_html=True)

# 功能特色
st.markdown("## ✨ 平台特色")
st.markdown("---")

col1, col2, col3 = st.columns(3)

with col1:
    st.markdown("""
    <div style='text-align: center; padding: 20px;'>
        <div style='font-size: 3rem; color: #1f77b4; margin-bottom: 15px;'>📈</div>
        <h4 style='color: #1f77b4;'>实时数据</h4>
        <p style='color: #6c757d;'>基于最新交易数据的实时分析，确保决策的时效性</p>
    </div>
    """, unsafe_allow_html=True)

with col2:
    st.markdown("""
    <div style='text-align: center; padding: 20px;'>
        <div style='font-size: 3rem; color: #1f77b4; margin-bottom: 15px;'>🔒</div>
        <h4 style='color: #1f77b4;'>安全可靠</h4>
        <p style='color: #6c757d;'>企业级安全标准，保障数据安全和业务连续性</p>
    </div>
    """, unsafe_allow_html=True)

with col3:
    st.markdown("""
    <div style='text-align: center; padding: 20px;'>
        <div style='font-size: 3rem; color: #1f77b4; margin-bottom: 15px;'>💡</div>
        <h4 style='color: #1f77b4;'>智能洞察</h4>
        <p style='color: #6c757d;'>AI驱动的智能分析，提供深度业务洞察和预测</p>
    </div>
    """, unsafe_allow_html=True)

# 页脚
st.markdown("---")
st.markdown("""
<div style='text-align: center; color: #6c757d; margin-top: 40px; padding: 20px;'>
    <p>银行数据分析平台 © 2024 | 专业 · 精准 · 高效</p>
    <p style='font-size: 0.9rem;'>技术支持：数据分析团队</p>
</div>
""", unsafe_allow_html=True)